
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title>เข้าสู่ระบบจัดการข้อมูลกิจกรรมนักศึกษา</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <style>
                body {
                        margin: 0;
                        padding: 0;
                        background: #f4f4f4;
                        font: 14px;
                        font-family: tahoma;
                        overflow: hidden
                }

                .link { text-align: center; clear: both; padding: 20px 0; }
                .link a { color: #333333; }

                .wrapper {
                        width: 100%;
                        margin: 0px auto;
                        padding-top: 150px;
                        overflow: hidden;
                        padding-left: 450px;
                }

                /* Form 1 style */

                .form1 {
                        width: 450px;
                        float: left;
                        background: #fff;
                        color: #777;
                        -webkit-box-shadow: 0px 0px 8px 2px #d1d1d1;
                        -moz-box-shadow: 0px 0px 8px 2px #d1d1d1;
                        box-shadow: 0px 0px 8px 2px #d1d1d1; 
                        -webkit-border-top-left-radius: 0px;
                        -webkit-border-top-right-radius: 0px;
                        -webkit-border-bottom-right-radius: 6px;
                        -webkit-border-bottom-left-radius: 6px;
                        -moz-border-radius-topleft: 0px;
                        -moz-border-radius-topright: 0px;
                        -moz-border-radius-bottomright: 6px;
                        -moz-border-radius-bottomleft: 6px;
                        border-top-left-radius: 0px;
                        border-top-right-radius: 0px;
                        border-bottom-right-radius: 6px;
                        border-bottom-left-radius: 6px; 
                        overflow: hidden;
                }

                .formtitle {
                        padding: 10px;
                        line-height: 16px;
                        font-size: 13px;
                        text-shadow: -1px -1px #e87c19;
                        color: #fff;
                        font-weight: bold;
                        border-bottom: 1px solid #eb8d19;
                        width: 430px;
                        background: #ffbd27; /* Old browsers */
                        background: -moz-linear-gradient(top, #ffbd27 0%, #ffb119 50%, #ff9d19 51%, #ff9d19 100%); /* FF3.6+ */
                        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffbd27), color-stop(50%,#ffb119), color-stop(51%,#ff9d19), color-stop(100%,#ff9d19)); /* Chrome,Safari4+ */
                        background: -webkit-linear-gradient(top, #ffbd27 0%,#ffb119 50%,#ff9d19 51%,#ff9d19 100%); /* Chrome10+,Safari5.1+ */
                        background: -o-linear-gradient(top, #ffbd27 0%,#ffb119 50%,#ff9d19 51%,#ff9d19 100%); /* Opera11.10+ */
                        background: -ms-linear-gradient(top, #ffbd27 0%,#ffb119 50%,#ff9d19 51%,#ff9d19 100%); /* IE10+ */
                        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffbd27', endColorstr='#ff9d19',GradientType=0 ); /* IE6-9 */
                        background: linear-gradient(top, #ffbd27 0%,#ffb119 50%,#ff9d19 51%,#ff9d19 100%); /* W3C */
                }

                .input {
                        width: 410px;
                        border-bottom: 1px solid #ddd;
                        margin-bottom: 10px;
                        margin: 20px;
                        overflow: hidden;
                }

                .inputtext {
                        float: left;
                        line-height: 18px;
                        height: 35px;
                        font-size: 14px;
                        width: 120px;
                }

                .inputcontent {
                        float: left;
                        width: 290px;
                        height: 50px;
                }

                .inputcontent input {
                        padding: 5px;
                        height: 18px;
                        width: 200px;
                        line-height: 18px;
                        border: 1px solid #c7c7c7;
                        -moz-border-radius:6px;
                        -webkit-border-radius:6px;
                        border-radius:6px;
                        color: #777;
                }

                .inputcontent a {
                        color: #0084ff;
                        font-size: 12px;
                        text-decoration: none;
                        line-height: 12px;
                }

                .nobottomborder {
                        border-bottom: 0;
                }

                .buttons {
                        background: #f1f1f1;
                        border-top: 1px solid #ddd;
                        padding: 15px;
                        height: 34px;
                }

                .greybutton {
                        background: #e1e1e1; /* Old browsers */
                        background: -moz-linear-gradient(top, #e1e1e1 0%, #bababa 100%); /* FF3.6+ */
                        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e1e1e1), color-stop(100%,#bababa)); /* Chrome,Safari4+ */
                        background: -webkit-linear-gradient(top, #e1e1e1 0%,#bababa 100%); /* Chrome10+,Safari5.1+ */
                        background: -o-linear-gradient(top, #e1e1e1 0%,#bababa 100%); /* Opera11.10+ */
                        background: -ms-linear-gradient(top, #e1e1e1 0%,#bababa 100%); /* IE10+ */
                        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e1e1e1', endColorstr='#bababa',GradientType=0 ); /* IE6-9 */
                        background: linear-gradient(top, #e1e1e1 0%,#bababa 100%); /* W3C */ 
                        border: 1px solid #bababa;
                        -webkit-border-radius: 20px;
                        -moz-border-radius: 20px;
                        border-radius: 20px; 
                        line-height: 20px;
                        font-size: 16px;
                        padding: 6px 12px;
                        color: #fff;
                        text-shadow: -1px -1px #bababa;
                        float: right;
                        margin-left: 10px;
                        cursor: pointer;
                }

                .greybutton:hover{
                        background: #bababa; /* Old browsers */
                        background: -moz-linear-gradient(top, #bababa 0%, #e1e1e1 100%); /* FF3.6+ */
                        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bababa), color-stop(100%,#e1e1e1)); /* Chrome,Safari4+ */
                        background: -webkit-linear-gradient(top, #bababa 0%,#e1e1e1 100%); /* Chrome10+,Safari5.1+ */
                        background: -o-linear-gradient(top, #bababa 0%,#e1e1e1 100%); /* Opera11.10+ */
                        background: -ms-linear-gradient(top, #bababa 0%,#e1e1e1 100%); /* IE10+ */
                        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bababa', endColorstr='#e1e1e1',GradientType=0 ); /* IE6-9 */
                        background: linear-gradient(top, #bababa 0%,#e1e1e1 100%); /* W3C */ 
                }

                .orangebutton {
                        background: #ffc339; /* Old browsers */
                        background: -moz-linear-gradient(top, #ffc339 0%, #ff9b19 100%); /* FF3.6+ */
                        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffc339), color-stop(100%,#ff9b19)); /* Chrome,Safari4+ */
                        background: -webkit-linear-gradient(top, #ffc339 0%,#ff9b19 100%); /* Chrome10+,Safari5.1+ */
                        background: -o-linear-gradient(top, #ffc339 0%,#ff9b19 100%); /* Opera11.10+ */
                        background: -ms-linear-gradient(top, #ffc339 0%,#ff9b19 100%); /* IE10+ */
                        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc339', endColorstr='#ff9b19',GradientType=0 ); /* IE6-9 */
                        background: linear-gradient(top, #ffc339 0%,#ff9b19 100%); /* W3C */
                        border: 1px solid #ff9b19;
                        -webkit-border-radius: 20px;
                        -moz-border-radius: 20px;
                        border-radius: 20px; 
                        line-height: 20px;
                        font-size: 16px;
                        padding: 6px 12px;
                        color: #fff;
                        text-shadow: -1px -1px #ff9b19;
                        float: right;
                        margin-left: 10px;
                        cursor: pointer;
                }

                .orangebutton:hover{
                        background: #ff9b19; /* Old browsers */
                        background: -moz-linear-gradient(top, #ff9b19 0%, #ffc339 100%); /* FF3.6+ */
                        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9b19), color-stop(100%,#ffc339)); /* Chrome,Safari4+ */
                        background: -webkit-linear-gradient(top, #ff9b19 0%,#ffc339 100%); /* Chrome10+,Safari5.1+ */
                        background: -o-linear-gradient(top, #ff9b19 0%,#ffc339 100%); /* Opera11.10+ */
                        background: -ms-linear-gradient(top, #ff9b19 0%,#ffc339 100%); /* IE10+ */
                        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9b19', endColorstr='#ffc339',GradientType=0 ); /* IE6-9 */
                        background: linear-gradient(top, #ff9b19 0%,#ffc339 100%); /* W3C */
                }

                /* Form 2 Style */

                .form2 {
                        width: 450px;
                        float: right;
                        background: #fff;
                        color: #777;
                        -webkit-box-shadow: 0px 0px 8px 2px #d1d1d1;
                        -moz-box-shadow: 0px 0px 8px 2px #d1d1d1;
                        box-shadow: 0px 0px 8px 2px #d1d1d1; 
                        -webkit-border-top-left-radius: 0px;
                        -webkit-border-top-right-radius: 0px;
                        -webkit-border-bottom-right-radius: 6px;
                        -webkit-border-bottom-left-radius: 6px;
                        -moz-border-radius-topleft: 0px;
                        -moz-border-radius-topright: 0px;
                        -moz-border-radius-bottomright: 6px;
                        -moz-border-radius-bottomleft: 6px;
                        border-top-left-radius: 0px;
                        border-top-right-radius: 0px;
                        border-bottom-right-radius: 6px;
                        border-bottom-left-radius: 6px; 
                        overflow: hidden;
                }

                .textarea {
                        padding: 5px;
                        height: 100px;
                        width: 200px;
                        line-height: 18px;
                        border: 1px solid #c7c7c7;
                        -moz-border-radius:6px;
                        -webkit-border-radius:6px;
                        border-radius:6px;
                        color: #777;
                }

                .inputtextbox {
                        width: 410px;
                        margin-bottom: 10px;
                        margin: 20px;
                        overflow: hidden;
                }

                .inputtextbox .inputcontent {
                        height: 114px;
                }
                select[name=account_type]{
                    width:210px;
                    height:28px;
                    font-size: 13px;
                    font-weight: bold;
                    color:#555
                }
  </style>
  <script  src="<?=base_url()?>res/javascripts/jquery/jquery-1.8.3.js"></script>
</head>
<body>

	<div class="wrapper" >

		<form class="form1"  method="post"  action="<?=base_url()?>authen/checklogin/_file/authen.go"  target="ifrm">

			<div class="formtitle">เข้าสู่ระบบบริหารจัดการกิจกรรม</div>

			<div class="input">
				<div class="inputtext">Username: </div>
				<div class="inputcontent">

					<input type="text"  name="username" />

				</div>
			</div>

			<div class="input nobottomborder">
				<div class="inputtext">Password: </div>
				<div class="inputcontent">

					<input type="password"  name="password" />
					

				</div>
			</div>
			<div class="input nobottomborder">
				<div class="inputtext">สถานะ: </div>
				<div class="inputcontent">

                                                                <select  class="inputtext" name="account_type" >
                                                                    <option value="class_c">นักศึกษา</option>
                                                                    <option value="class_t">อาจารย์</option>
                                                                    <option value="class_a">ผู้ดูแลระบบ</option>
                                                                </select>
				<br/>
				</div>
			</div>
			<div class="buttons">
                                                        <input class="orangebutton" type="reset" value="reset" />
                                                        <input class="orangebutton" type="submit" value="Login" />
			</div>

		</form>
	</div>	
    <iframe  name="ifrm"  style="display: none"></iframe>
</body>
    <script>
        
        function gotoPage(){
            var v = $("select[name=account_type]").val();
            if(v == "class_c"){
                window.location =  "<?=base_url()?>"  + "collegian_activity";
            }else if(v=="class_a"){
                window.location =  "<?=base_url()?>"  + "activity/view_activitys";
            }else if(v=="class_t"){
                window.location =  "<?=base_url()?>"  + "teacher/teacher_activity";
            }
        }
        
        function resetlogin(){
             $("form[class=form1]")[0].reset();
        }
        
        $(document).ready(function(){
            var w = $("body").width();
            var h = $("height").width();
            $("form[class=form1]").submit(function(){
                if($("input[name=username]").val() == ""){
                    alert("กรุณากรอกชื่อเข้าสู่ระบบ");
                    return false;
                }else if( $("input[name=username]").val() == "" ){
                    alert("กรุณากรอกรหัสเข้าสู่ระบบ");
                    return false;
                }
                
                return true;
            });
        });
        
    </script>
</html>